<!-- 首页 -->
<template>
    <view class="home-wrap u-m-b-20">
        <shopro-navbar :isBack="false">
            <text
                slot="content"
                style="color: #000; width: 100%; text-align: center;padding-left: 20rpx;font-size:30rpx"
                @click="userInfo.password?'':denglu()"
            >
                {{'校级智慧体测数据平台'}}
            </text>
        </shopro-navbar>
        <view class="content-box u-p-10 u-m-l-20 u-m-r-20 u-m-t-30">
            <view class="u-flex u-flex-col kehu-item">
                <view class="swipers">
                    <u-swiper :height="280" borderRadius="20" :list="goodsInfo.images" indicator-pos="bottomRight" mode="number" :interval="3000"></u-swiper>
                </view>
            </view>
            <view class="topic u-flex u-row-between u-p-20 u-m-t-30" v-if="userInfo.user_type!='1'&&uncompletedCount>0">
                <view class="topic_left u-flex u-row-center u-col-center u-p-r-20">
                    <image :src="API_URL()+'images/index/tongzhi.png'"></image>
                </view>
                <view class="topic_right u-flex u-row-between u-col-center">
                    <view class="title_topic">同学，您好，您有新的体育任务，请查收</view>
                    <view class="title_right u-flex u-row-between u-col-center">
                        <view class="point u-m-r-10"></view>
                        <image class="arrow-right" :src="$API_URL+'images/index/arrow.png'"></image>
                    </view>
                </view>
            </view>
            <!--            员工信息-->
            <view class="u-flex u-flex-col u-p-l-20 u-p-r-20 u-p-b-20 yuangong-item">
                <view class="u-flex u-p-10 u-w-100s u-row-between u-flex-wrap top-yuangong">
                    <view class="u-flex u-flex-col u-row-left u-col-center xinxi-item" @click="jump(userInfo.user_type=='1'?'/pages-kehu/teacherTask':'/pages-kehu/zuzhichengyuan')">
                        <image :src="API_URL()+'images/index/renwu.png'"></image>
                        <view class="title_biao">体测任务</view>
                    </view>
                    <view class="u-flex u-flex-col u-row-left u-col-center xinxi-item" @click="jump('/pages-activity/selfData')" v-if="userInfo.user_type!='1'">
                        <image :src="API_URL()+'images/index/baobiao.png'"></image>
                        <view class="title_biao">个人报表</view>
                    </view>
                    <view class="u-flex u-flex-col u-row-left u-col-center xinxi-item" @click="jump('/pages-kehu/shouhuanguanli')" v-if="userInfo.user_type=='1'">
                        <image :src="API_URL()+'images/index/shouhuan.png'"></image>
                        <view class="title_biao">手环管理</view>
                    </view>
	                <view class="u-flex u-flex-col u-row-left u-col-center xinxi-item" @click="jump('/pages-kehu/renwu')" v-if="userInfo.user_type!='1'">
		                <image :src="API_URL()+'images/ceshi.jpg'"></image>
		                <view class="title_biao">测试记录</view>
	                </view>
                    <view class="u-flex u-flex-col u-row-left u-col-center xinxi-item" @click="jump(userInfo.user_type=='1'?'/pages/user/teacherInfo':'/pages/user/userInfo')">
                        <image :src="API_URL()+'images/index/ziliao.png'"></image>
                        <view class="title_biao">个人资料</view>
                    </view>
                </view>
            </view>
            <u-calendar v-model="showriqi" :mode="mode" @change="changeDate"></u-calendar>
        </view>
    </view>
</template>

<script>

import {mapMutations, mapActions, mapState, mapGetters} from 'vuex';
import { API_URL } from '@/env'
let chart = null
export default {
    data() {
        return {
            goodsInfo: {
                images: [API_URL+'images/image.png'],
            },
            showriqi:false,
            mode:'date',
            homeData:{},
	        uncompletedCount:''
        };
    },
    computed: {
        ...mapGetters(['isLogin','userInfo']),

    },
    onPullDownRefresh() {

    },

    onShow() {

    },
    onHide() {

    },
    onLoad(options) {
        this.init()
    },
    methods: {
        API_URL() {
            return API_URL
        },
        // 初始化
        init() {
			if(this.userInfo.user_type!='1'){
				this.initdata()
			}
        },
        denglu() {
            this.$store.dispatch("showAuthModal", "1233");
        },
        initdata(){
	        let that = this;
	        that.$http(
		        "login.wei",
		        {},
		        "加载中..."
	        )
		        .then(res => {
			        that.uncompletedCount = res.uncompletedCount;
		        });
        },
        // 路由跳转
        jump(path, parmas) {
            console.log("====1111", path)
            this.$Router.push({
                path : path,
                query: parmas
            });
        },
    }
};
</script>

<style lang="scss" scoped>
.uni-ec-canvas {
    width: 100%;
    height: 400rpx;
    display: block;
}
.uni-ec-canvas-bing {
    width: 100%;
    height: 200rpx;
    display: block;
}
page {
    background: #FFFFFF;
}

.kehu-item {
    border-radius: 20rpx;
    width: 100%;
    .swipers{
        width: 100%;
    }
}
.topic{
    background: #F5F5F5;
    border-radius: 20rpx;
    .topic_left{
        width: 70rpx;
        height: 50rpx;
        image{
            width: 100%;
            height: 100%;
        }
    }
    .topic_right{
        width: 96%;
        .title_right{
            .point{
                width: 10rpx;
                height: 10rpx;

                border-radius: 50%;
                background: #FA3E3E;
            }
            .arrow-right{
                width: 20rpx;
                height: 30rpx;
            }
        }

    }
}
.yuangong-item {
    .xinxi-item{
        width: 48%;
        height: 160rpx;
        position: relative;
        margin-top: 20rpx;
        image{
            width: 100%;
            height: 100%;
        }
        .title_biao{
            position: absolute;
            top: 40%;
            left: 50%;
            font-sizw:34rpx;
            font-weight: bold;
            color:#fff;
        }
    }

}

.baobiao-item {
    background: linear-gradient(180deg, #F1F6FF 0%, rgba(255, 255, 255, 0.9) 100%);
    box-shadow: 0px 2px 4px 0px rgba(53, 110, 253, 0.05);

    .time-day {
        width: 100rpx;
        background: #2A6CFF;
        color: #fff;
        padding: 6rpx 8rpx;
    }

    .time-month {
        width: 100rpx;
        background: linear-gradient(180deg, #F1F6FF 0%, rgba(255,255,255,0.9) 100%);
        box-shadow: 0px 2px 4px 0px rgba(53,110,253,0.05);
        border-radius: 10rpx;
        color: #1989fa;
        padding: 6rpx 8rpx;
    }
}
.lenged{
    position: absolute;
    top: 16rpx;
    right: 20rpx;
    width: 36vw;
    padding: 10rpx 18rpx;
    .wancheng{
        width: 100%;
        .timu{
            color: #999;
        }
    }
}
::v-deep .u-drawer{
    z-index: 1110000!important;
}
</style>
